<!--{% from 'macros.html' import format_date, format_phone %}-->
<!DOCTYPE html> 
<html> 
	<head> 
	<title>SeatMe, the smart way to find your seat</title> 

	<meta charset="utf-8">
	<meta name="HandheldFriendly" content="true" />
	<meta name="MobileOptimized" content="320" />
	<meta name ="Viewport" content="width=device-width"/>
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
	<link rel="stylesheet" href="css/themes/test.css" /> 
	<link rel="stylesheet" href="css/themes/test.min.css" /> 
	<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile.structure-1.2.0.min.css" /> 

	<!--<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script> -->
	<script src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js"></script>
	<!--<script type="text/javascript">
		$(document).bind("mobileinit", function(){
		    $.extend(  $.mobile , { 
		          ajaxEnabled : false
		     });
		});
	</script>-->
	</head>




<body>


<div data-role="page" data-theme="a" id="main">
	<div data-role="header" class="swipe" >
	    <div data-role='header' data-position='inline' data-theme='d'>
		    <h1>SeatMe</h1>
	   	</div><!-- header -->

	   	<div data-role="content">

	   	</div>
</div>




<div data-role="page"  id="login" data-theme="a" >

	<div data-role="header">
		<h3>Login</h3>
	</div><!-- /header -->

	<div data-role="content">	
		<form action="widget.xml" method="post"> <!-- get or post method?-->
			<fieldset data-role="fieldcontain">
				<label for="user">Username:</label>
				<input type="text" name="user" id="user" value=""/>
			</fieldset>
			<fieldset data-role="fieldcontain">
				<label for="password">Password:</label>
				<input type="password" name="password" id="password" value=""/>	
			</fieldset>

			<input type="submit" value="Login" />
		</form>
	</div><!-- /content -->


</div><!-- /page -->


<!-- Start of second page -->
<div data-role="p" id="bar">

	<div data-role="header">
		<h1>Bar</h1>
	</div><!-- /header -->

	<div data-role="content">	
		<p>I'm the second in the source order so I'm hidden when the page loads. I'm just shown if a link that references my id is beeing clicked.</p>		
		<p><a href="#foo">Back to foo</a></p>	
	</div><!-- /content -->

	<div data-role="footer">
		<h4>Page Footer</h4>
	</div><!-- /footer -->
</div><!-- /page -->


</div>
	
<!-- 	<div id="content" data-role="content">
		<form name="go">
			<input type="button" name="test" value="Simple Index2" onclick="simpleIndex()">
			<input type="button" name="test" value="Simple Get" onclick="simpleGet()">
			<input type="button" name="test" value="Simple Post" onclick="simplePost()">
			<input type="button" name="test" value="Simple Put" onclick="simplePut()">
			<input type="button" name="test" value="Simple Delete" onclick="simpleDelete()">
		</form>
		<div id='IndexResult'></div>
		<div id='GetResult'></div>
		<div id='PostResult'></div>
		<div id='PutResult'></div>
		<div id='DeleteResult'></div>
	</div> -->
</div>


</body>
</html>